<%@ page language="java" contentType="text/html; charset=utf-8" pageEncoding="utf-8"%>
<%@include file="../../common/init_context.jsp"%>
<!DOCTYPE html>
<html>
<head>
    <title>国付宝收银台 - 订单</title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <link type="text/css" rel="stylesheet" href="${ROOT}/static/css/reset.css" media="all" />
    <link type="text/css" rel="stylesheet" href="${ROOT}/static/css/style.css" media="all" />
    <link type="text/css" rel="stylesheet" href="${ROOT}/static/css/ui-lightness/jquery-ui-1.9.2.custom.css" media="all" />
    <script type="text/javascript" src="${ROOT}/static/js/jquery-1.8.3.min.js"></script>
    <script type="text/javascript" src="${ROOT}/static/js/jquery-ui-1.9.2.custom.min.js"></script>
    <script type="text/javascript" src="${ROOT}/static/js/jquery.gopay.ext.js"></script>
    <script type="text/javascript" src="${ROOT}/static/js/gopay/expressPayChannel.js"></script>
    <!--[if IE 6]>
    <script src="../../javascripts/png_ie6fix.js" type="text/javascript"></script>
    <script type="text/javascript">
        EvPNG.fix("div, span,a");
    </script>

    <![endif]-->

    <script type="text/javascript">
        var ctx='${ctx}';
    </script>
</head>
<body>
<%@include file="../../common/header.jsp"%>
<div class="container1024">
    <div class="container960">
        <!-- 支付订单详情 -->
        <jsp:include page="../payInfoHead.jsp" flush="true"></jsp:include>
        <div class="borderBox-3">
            <div class="titleBox-1">
                <h6>您正在使用${bankName}付款</h6>
            </div>
            <form action="${ctx }/pay/ccfp/next.shtml" method="post" id="ccfpLoginForm" name="ccfpLoginForm">
                <table class="table-tml">
                    <tbody>

                    <tr>
                        <th width="375px">付款银行：</th>
                        <td><span class="red"><img width='190' height='36' src="${ctx }/BankIcon/${bankCode}.jpeg" /></span></td>
                    </tr>

                    <tr>
                        <th width="375px">银行预留手机号：</th>
                        <td><span class="red"><input type="text" id="bankPhoneNo" style="width: 215px;" name="bankPhoneNo" value="${bankPhoneNo}" onblur="checkBankPhoneNo();"></span></td>
                    </tr>
                    <tr id="bankPhoneNoTip" style="display: none">
                        <td width="375px"></td>
                        <td class="msg-error-td">
                            <span id="bankPhoneNoTipMsg" class="msg-error"></span>
                        </td>
                    </tr>
                    <tr>
                        <th width="375px">验证码：</th>
                        <td><input type="text" class="width134" name="authCode" id="authCode"  onblur="checkAuthCode();"/><img alt="点击图片" id="authCodeImg" class="checkCodeImg" src="${ctx }/captcha/default.jpeg?timestamp=${formhash }" onclick="refreshAuthCode();" style="cursor:pointer;"></td>
                    </tr>
                    <tr id="authCodeTip" style="display: none">
                        <td width="375px"></td>
                        <td class="msg-error-td">
                            <span id="authCodeTipMsg" class="msg-error"></span>
                        </td>
                    </tr>
                    <tr>
                        <td colspan="2" align="center" height="100px"><button type="button" id="payConfirmSubmitId" class="btn-1" onclick="ccfpLoginSubmit();">下一步</button></td>
                    </tr>
                    </tbody>
                </table>
                <input type="hidden" name="formhash" id="formhash" value="${formhash }"/>
                <input type="hidden" name="orderId" id="orderId" value="${orderId }"/>
            </form>
        </div>
    </div>
    <br>
</div>
<script>
    function checkBankPhoneNo(){
        var bankPhoneNo = $("#bankPhoneNo").val();
        if($.trim(bankPhoneNo) == ""){
            $("#bankPhoneNoTip").show();
            $("#bankPhoneNoTipMsg").html("请输入银行预留手机号");
            return ;
        }
        if(!/^1\d{10}$/.test(bankPhoneNo)){
            $("#bankPhoneNoTip").show();
            $("#bankPhoneNoTipMsg").html("手机号格式有误，请重新输入");
            return;
        }
        $("#bankPhoneNoTip").hide();
        $("#bankPhoneNoTipMsg").html("");
    }
    function checkAuthCode(){
        var authCode = $("#authCode").val();
        if($.trim(authCode) == ""){
            $("#authCodeTip").show();
            $("#authCodeTipMsg").html("请输入验证码");
            return ;
        }
        $("#authCodeTip").hide();
        $("#authCodeTipMsg").html("");
    }

    function ccfpLoginSubmit(){
        if($.trim($("#bankPhoneNo").val()) == ""){
            $("#bankPhoneNoTip").show();
            $("#bankPhoneNoTipMsg").html("请输入银行预留手机号");
            return ;
        }
        if($.trim($("#authCode").val()) == ""){
            $("#authCodeTip").show();
            $("#authCodeTipMsg").html("请输入验证码");
            return ;
        }
        $("#ccfpLoginForm").submit();
    }
</script>
<%@include file="../../common/footer.jsp"%>
</body>
</html>